<template>
  <div style="margin:26px 0 0;">
    <div style="font-size: 18px;">
      <div>
        <el-row :span="24" style="margin:0px 0 0;">
          <el-form :inline="true" :model="formInlineToday" class="demo-form-inline" label-width="100px">
            <el-form-item label="商户名称">
              <el-input style="width: 166px;" v-model="formInlineToday.storeName"></el-input>
            </el-form-item>
            <el-form-item label="选择日期:">
              <el-select style="width: 166px;" v-model="formInlineToday.flag">
                <el-option v-for="item in flagList" :label="item.label" :value="item.value" :key="item.value"></el-option>
              </el-select>
              <el-date-picker type="date" placeholder="开始时间" v-model="startTimeToday" style="width:180px;">
              </el-date-picker>
              到
              <el-date-picker type="date" placeholder="结束时间" v-model="endTimeToday" style="width:180px;">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="按转账状态:">
              <el-select v-model="formInlineToday.orderStatus" style="width: 166px;">
                <el-option v-for="item in orderStatusList" :label="item.label" :value="item.value" :key="item.value"></el-option>
              </el-select>
            </el-form-item>
            <el-button type="primary" @click="fetchDataToday(1)">查询</el-button>
            <el-button :disabled="btnShow" v-if="powerCode == 'power0000000001'" type="primary" @click="addBrandOp()">
              转账1%
            </el-button>
          </el-form>
        </el-row>
      </div>
      <el-table :data="pageInfoToday.dtos" v-loading="table_loadingToday" element-table_loading-text="加载中"
        style="width: 100%;">
        <el-table-column label="商户名称" prop='storeName'>
        </el-table-column>
        <el-table-column label="支付日期" prop='payTime'>
        </el-table-column>
        <el-table-column label="收货日期" prop='okTime'>
        </el-table-column>
        <el-table-column label="转账日期" prop='tranferTime'>
        </el-table-column>
        <el-table-column label="交易金额总额" prop='orderAmt'>
        </el-table-column>
        <el-table-column label="转账金额总额">
          <template scope="scope">
            <div>{{scope.row.orderDiscountAmt | moneyTwo}}</div>
          </template>
        </el-table-column>
        <el-table-column label="冻结金额总额">
          <template scope="scope">
            <div>{{scope.row.frozenAmt | moneyTwo}}</div>
          </template>
        </el-table-column>
        <!-- <el-table-column label="待转账金额">
          <template scope="scope">
            <div>{{scope.row.notTranferAmt | moneyTwo}}</div>
          </template>
        </el-table-column> -->
        <el-table-column label="转账状态">
          <template scope="scope">
            <p v-if="scope.row.orderStatus == 'N'">待转账</p>
            <p v-if="scope.row.orderStatus == 'Y'">已转账</p>
          </template>
        </el-table-column>
        <el-table-column label="操作">
          <template scope="scope">
            <el-button
              v-if="scope.row.orderStatus == 'N' && scope.row.tranferTime != undefined && powerCode == 'power0000000001'"
              type="primary" size="small" @click="confirmCash(scope.row)">转账
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="addall">
        <div>交易金额总额总计：{{orderAmtall | moneyTwo}}</div>
        <div>转账金额总额总计：{{orderDiscountAmtall | moneyTwo}}</div>
        <div>冻结金额总额总计：{{frozenAmtall | moneyTwo}}</div>
      </div>
      <div class="paginate">
        <el-pagination @current-change="handleCurrentTodayChange" :current-page="pageInfoToday.pageNum"
          :page-size="pageInfoToday.pageSize" layout="total, prev, pager, next, jumper" :total="pageInfoToday.count">
        </el-pagination>
      </div>
    </div>
    <div>
      <el-dialog title="转账" :visible.sync="dialogVisibleConfirmCash" width="45%">
        <div style="font-size: 18px;">
          <div>
            <el-form :inline="true" :model="ConfirmCashInfo" class="demo-form-inline" label-width="100px">
              <el-form-item label="转账金额">
                <el-input v-model="ConfirmCashInfo.orderDiscountAmt"></el-input>
              </el-form-item>
              <el-form-item label="支付日期">
                <el-input readonly v-model="payTime"></el-input>
              </el-form-item>
              <el-form-item label="货款日期">
                <el-input readonly v-model="okTime"></el-input>

              </el-form-item>

              <el-button type="primary" @click="ConfirmCashAmt">确认转账</el-button>
            </el-form>
          </div>
        </div>
      </el-dialog>
      <el-dialog title="身份验证" :visible.sync="BrandCashInfoVisibleVerify" width="45%">
        <div style="font-size: 18px;">
          <div>
            <el-form :inline="true" :model="BrandCashInfo" class="demo-form-inline" label-width="100px">
              <el-form-item label="当前账户密码">
                <el-input v-model="BrandCashInfo.pswd"></el-input>
              </el-form-item>
              <el-button type="primary" @click="verifyBrandCash">确认转账</el-button>
            </el-form>
          </div>
        </div>
      </el-dialog>
      <el-dialog title="身份验证" :visible.sync="dialogVisibleVerifyPswd" width="45%">
        <div style="font-size: 18px;">
          <div>
            <el-form :inline="true" :model="userInfo" class="demo-form-inline" label-width="100px">
              <el-form-item label="当前账户密码">
                <el-input v-model="userInfo.pswd"></el-input>
              </el-form-item>
              <el-button type="primary" @click="verifyPswd">确认转账</el-button>
            </el-form>
          </div>
        </div>
      </el-dialog>
      <el-dialog title="转账" :visible.sync="dialogVisibleVerifyBrand" width="45%">
        <div style="font-size: 18px;">
          <div>
            <el-form :inline="false" :model="addBrandMoneyInfo" class="demo-form-inline" label-width="100px">
              <el-form-item label="转账金额">
                <el-input style="width: 250px;" v-model="addBrandMoneyInfo.count"></el-input>
              </el-form-item>

              <el-button type="primary" @click="confirmBrandCash()">确认</el-button>
            </el-form>
          </div>
        </div>
      </el-dialog>
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        flagList: [{
            value: '0',
            label: '按付款时间'
          }, {
            value: '1',
            label: '按收货时间'
          },
          {
            value: '2',
            label: '按已转账时间'
          },
          {
            value: '3',
            label: '按待转账时间'
          }
        ],
        orderStatusList: [{
          value: '',
          label: '全部'
        }, {
          value: 'N',
          label: '未转账'
        }, {
          value: 'Y',
          label: '已转账'
        }],
        userInfo: {
          pswd: ''
        },
        payTime:'',
        verIfy: '556640',
        dialogVisibleVerifyPswd: false,
        dialogVisibleToday: false,
        formInlineToday: {
          pageNum: 1,
          pageSize: 10,
          storeId: '',
          storeName: '',
          orderStatus: '',
          okTimeStart: '',
          okTimeEnd: '',
          sort: 'T.pay_time',
          desc: 'desc',
          flag: ''
        },
        pageInfoToday: {
          pageNum: 1,
          pageSize: 10,
          count: 1,
          dtos: []
        },
        startTimeToday: '',
        endTimeToday: '',
        table_loadingToday: false,
        dialogVisibleConfirmCash: false,
        ConfirmCashInfo: {},
        ConfirmCashNum: '',
        okTime: '',
        powerCode: '',
        pickerOptions0: {
          disabledDate(time) {
            return time.getTime() > Date.now()
          }
        },
        dialogVisibleVerifyBrand: false,
        addBrandInfo: {
          flag: 1
        },
        addBrandMoneyInfo: {
          count: 0
        },
        btnShow: false,
        BrandCashInfo: {
          pswd: ''
        },
        BrandCashInfoVisibleVerify: false,
        // 三个总计
        orderAmtall:0,
        orderDiscountAmtall:0,
        frozenAmtall:0,


      }
    },

    filters: {
      moneyTwo(val) {
        let money = Math.floor(val * 100) / 100
        return money
      }
    },
    mounted() {
      // console.log(JSON.parse(sessionStorage.getItem('permission')), 789)
      this.fetchDataToday(1)
      this.powerCode = JSON.parse(sessionStorage.getItem('permission')).userPowerDtos[0].powerCode
    },
    methods: {
      handleCurrentTodayChange(val) {
        this.fetchDataToday(val)
      },
      // 日统计明细
      fetchDataToday(page = 1) {
        let vm = this
        if (vm.startTimeToday && vm.endTimeToday) {
          vm.formInlineToday.okTimeStart = dateFormat(vm.startTimeToday)
          vm.formInlineToday.okTimeEnd = dateFormat(vm.endTimeToday).substring(0, 11) + '23:59:59'
          if (vm.formInlineToday.okTimeStart > vm.formInlineToday.okTimeEnd) {
            vm.$message({
              type: 'warning',
              message: '开始时间不能大于结束时间'
            });
            return;
          }
        } else {
          vm.formInlineToday.okTimeStart = ''
          vm.formInlineToday.okTimeEnd = ''
        }
        if (vm.startTimeToday && !vm.endTimeToday) {
          vm.$message({
            type: 'warning',
            message: '请选择结束时间'
          });
          vm.table_loadingToday = false
          return;
        }
        if (!vm.startTimeToday && vm.endTimeToday) {
          vm.$message({
            type: 'warning',
            message: '请选择开始时间'
          });
          vm.table_loadingToday = false
          return;
        }
        // 初始化
        vm.pageInfoToday.pageNum = page
        vm.formInlineToday.pageNum = page
        vm.orderAmtall=0
        vm.orderDiscountAmtall=0
        vm.frozenAmtall=0
        vm.table_loadingToday = true
        vm.dataApi.ajax('tranferSumOneList', vm.formInlineToday, res => {
          vm.table_loadingToday = false
          let data = JSON.parse(JSON.stringify(res))
          vm.pageInfoToday.dtos = data.lists
          // console.log('请求下来的数据=====',data.lists)
          for(var i = 0 ;i<data.lists.length;i++){
            this.orderAmtall=this.orderAmtall+data.lists[i].orderAmt;
            this.orderDiscountAmtall=this.orderDiscountAmtall+data.lists[i].orderDiscountAmt;
            this.frozenAmtall=this.frozenAmtall+data.lists[i].frozenAmt;
          }
          // console.log('三个总和=====',this.orderAmtall,this.orderDiscountAmtall,this.frozenAmtall)
          vm.pageInfoToday.count = data.count
        });
      },
      getNewDate(e) {
        if (e != undefined) {
          let str = e.substring(0, 11)
          this.okTime = str + '23:59:59'
        }

      },
      confirmCash(item) {
        this.dialogVisibleConfirmCash = true
        this.ConfirmCashInfo = JSON.parse(JSON.stringify(item))
        this.ConfirmCashInfo.orderDiscountAmt = Math.floor(this.ConfirmCashInfo.orderDiscountAmt * 100) / 100
        this.ConfirmCashNum = JSON.parse(JSON.stringify(item.orderDiscountAmt))
        this.okTime = JSON.parse(JSON.stringify(item.okTime)) + ' ' + '23:59:59'
        this.payTime = JSON.parse(JSON.stringify(item.payTime)) + ' ' + '23:59:59'
      },
      verifyPswd() {
        let vm = this
        let data = {
          sysCode: 'pwd',
        }
        vm.dataApi.ajax('singleSysParamById', data, res => {
          if (res.responseType === 'S') {
            let value = res.sysValue
            // console.log('密码对比',this.userInfo.pswd,'和',value)
            if (this.userInfo.pswd == value) {
              this.pay()
            } else {
              this.showMsg('密码不正确，请检查密码再次转账')
            }
          }
        })
      },
      pay() {
        this.dialogVisibleVerifyPswd = false
        let data = {
          storeId: this.ConfirmCashInfo.storeId,
          transferAmount: this.ConfirmCashInfo.orderDiscountAmt,
          okTime: this.okTime,
          payTime: this.payTime
        }
        this.dataApi.ajax('storeTransfer', data, res => {

          this.dialogVisibleConfirmCash = false
          if (res.responseType === 'S') {
            this.showMsg('转账成功')
            this.fetchDataToday(this.formInlineToday.pageNum)
            this.userInfo.pswd = ''
            this.dialogVisibleConfirmCash = false
          }
        });
      },
      ConfirmCashAmt() {
        if (this.ConfirmCashNum < this.ConfirmCashInfo.orderDiscountAmt) {
          this.showMsg('转账金额不能大于待转账金额')
          return
        }
        this.dialogVisibleVerifyPswd = true
        return

      },
      confirmBrandCash() {
        let vm = this
        vm.BrandCashInfoVisibleVerify = true
        return
        vm.dataApi.ajax('payBatchAccount', vm.addBrandInfo, res => {
          if (res.responseType === 'S') {
            vm.showMsg('代付成功')
            vm.dialogVisibleVerifyBrand = false
          }
        });
      },
      verifyBrandCash() {
        let vm = this
        let data = {
          sysCode: 'pwd',
        }

        vm.dataApi.ajax('singleSysParamById', data, res => {
          if (res.responseType === 'S') {
            let value = res.sysValue
            // console.log('外面密码返值',value)
            if (vm.BrandCashInfo.pswd == value) {
              vm.dataApi.ajax('payBatchAccount', vm.addBrandInfo, res => {
                if (res.responseType === 'S') {
                  vm.showMsg('代付成功')
                  vm.dialogVisibleVerifyBrand = false
                  vm.BrandCashInfoVisibleVerify = false
                  vm.BrandCashInfo.pswd = ''
                }
              });
            } else {
              vm.showMsg('密码不正确，请检查密码再次转账')
            }
          }
        })
      },
      addBrandOp() {
        let vm = this
        vm.dataApi.ajax('selectPayBatch', null, res => {
          if (res.responseType === 'S') {
            vm.addBrandMoneyInfo.count = res.amt
            vm.dialogVisibleVerifyBrand = true
          }
        })

      }
    }
  }
</script>


<style type="text/css">
  .addall{
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #1f2d3d;
    margin: 20px 0;

  }
  .addall div{
    margin-right: 30px;
  }
</style>
